<style lang="less" scoped>
.cardiovascular-program {
  width: 100%;
  height: 100%;
  /deep/.el-table__inner-wrapper {
    height: 100% !important;
  }
  /deep/.el-dialog__header {
    text-align: center;
  }
  .pagination-css {
    padding: 5px;
    box-sizing: border-box;
    background-color: #fff;
    display: flex;
    justify-content: right;
    margin-top: 5px;
  }
  .box-img {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 300px;
    div {
      width: 48%;
      height: 100%;
    }
  }
  .box-video {
    width: 100%;
    margin-top: 10px;
    padding: 0 10px;
    box-sizing: border-box;
  }
  .box-totip {
    margin-top: 10px;
    div {
      margin: 5px 0;
      word-wrap: break-word;
    }
  }
}
</style>

<template>
  <div class="cardiovascular-program">
    <el-form
      :inline="true"
      :model="formInline"
      class="demo-form-inline form-css"
    >
      <el-form-item label="关键字：">
        <el-input
          v-model="formInline.keyword"
          placeholder="请输入条码、姓名、设备名称"
        />
      </el-form-item>
      <el-form-item label="检查时间：">
        <el-date-picker
          v-model="formInline.inspectionTime"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="YYYY-MM-DD HH:mm:ss"
          style="width: 300px"
        />
      </el-form-item>
      <el-form-item label="上传时间：">
        <el-date-picker
          v-model="formInline.uploadTime"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="YYYY-MM-DD HH:mm:ss"
          style="width: 300px"
        />
      </el-form-item>
      <el-form-item label="报告时间：">
        <el-date-picker
          v-model="formInline.reportTime"
          type="daterange"
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="YYYY-MM-DD HH:mm:ss"
          style="width: 300px"
        />
      </el-form-item>
      <el-form-item label="项目点名称：">
        <el-cascader
          v-model="formInline.projectName"
          :props="hosProps"
          filterable
        />
        <!-- <el-input v-model="formInline.projectName"  placeholder="请输入项目点名称" /> -->
      </el-form-item>
      <el-form-item label="审核机构名称：">
        <el-cascader
          v-model="formInline.auditorName"
          :props="auditProps"
          filterable
        />
        <!-- <el-input v-model="formInline.auditorName"  placeholder="请输入审核机构名称" /> -->
      </el-form-item>
      <el-form-item label="审核医师：">
        <el-input
          v-model="formInline.auditorDoctor"
          placeholder="请输入审核医师"
        />
      </el-form-item>
      <el-form-item label="报告状态：">
        <el-select v-model="formInline.reportStatus" placeholder="请选择">
          <el-option
            v-for="item in statusList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="">
        <el-button type="primary" @click="search"
          ><el-icon style="margin-right: 6px"><Search /></el-icon
          >搜索</el-button
        >
        <el-button @click="reset"
          ><el-icon style="margin-right: 6px"><Refresh /></el-icon
          >重置</el-button
        >
        <!-- <el-button type="primary"><el-icon><Document /></el-icon>导出</el-button> -->
      </el-form-item>
    </el-form>
    <div class="filter-column">
      <el-popover
        placement="bottom"
        title="筛选条件"
        :width="150"
        trigger="click"
      >
        <el-checkbox-group v-model="filtrateList" @change="changeBox">
          <el-checkbox label="t_sn">条码</el-checkbox>
          <el-checkbox label="insname">项目点名称</el-checkbox>
          <el-checkbox label="name">姓名</el-checkbox>
          <el-checkbox label="sex">性别</el-checkbox>
          <el-checkbox label="age">年龄</el-checkbox>
          <el-checkbox label="devname">设备名称</el-checkbox>
          <el-checkbox label="auditstatus">报告状态</el-checkbox>
          <el-checkbox label="dicomurl">常规报告</el-checkbox>
          <el-checkbox label="upstat">国家报告</el-checkbox>
          <el-checkbox label="videourl">原始影像</el-checkbox>
          <el-checkbox label="checkTime">检查时间</el-checkbox>
          <el-checkbox label="docname">检查医师</el-checkbox>
          <el-checkbox label="uploadTime">上传时间</el-checkbox>
          <el-checkbox label="analyseDoc">分析医师</el-checkbox>
          <el-checkbox label="reportTime">报告时间</el-checkbox>
          <el-checkbox label="auditinsname">审核机构名称</el-checkbox>
          <el-checkbox label="auditname">审核医师</el-checkbox>
          <el-checkbox label="audittm">审核时间</el-checkbox>
          <el-checkbox label="devid">设备SN</el-checkbox>
        </el-checkbox-group>
        <template #reference>
          <el-button type="text"
            ><div class="shaixuan">
              <img src="@/images/shaixuan.png" alt="" /> 筛选列
            </div></el-button
          >
        </template>
      </el-popover>
    </div>
    <el-table
      v-loading="tableLoading"
      :data="tableData"
      :header-cell-style="{ backgroundColor: '#EEF6FF' }"
      stripe
      border
      height="calc(100% - 207px)"
      style="width: 100%; padding: 10px"
    >
      <el-table-column type="index" width="50" align="center" />
      <el-table-column
        v-if="filtrateList.includes('t_sn')"
        prop="t_sn"
        min-width="120px"
        label="条码"
        align="center"
        show-overflow-tooltip
      />
      <el-table-column
        v-if="filtrateList.includes('insname')"
        prop="insname"
        min-width="120px"
        label="项目点名称"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('name')"
        prop="name"
        min-width="80px"
        label="姓名"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('sex')"
        prop="sex"
        min-width="80px"
        label="性别"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('age')"
        prop="age"
        min-width="80px"
        label="年龄"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('devname')"
        prop="devname"
        min-width="120px"
        label="设备名称"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('auditstatus')"
        prop="auditstatus"
        min-width="84px"
        label="报告状态"
        align="center"
      >
        <template #default="{ row }">
          <span>{{
            row.auditstatus == 0
              ? "待审核"
              : row.auditstatus == 1
              ? "审核中"
              : row.auditstatus == 2
              ? "退回重审"
              : row.auditstatus == 10
              ? "已审核"
              : ""
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="filtrateList.includes('dicomurl')"
        prop="dicomurl"
        min-width="120px"
        label="常规报告"
        align="center"
        show-overflow-tooltip
      >
        <template #default="{ row }">
          <span @click="regularInfo(row)" style="cursor: pointer"
            ><el-icon><Document /></el-icon
          ></span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="filtrateList.includes('upstat')"
        prop="upstat"
        min-width="84px"
        label="国家报告"
        align="center"
      >
        <template #default="{ row }">
          <span @click="nationalInfo(row)" style="cursor: pointer"
            ><el-icon><Document /></el-icon
          ></span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="filtrateList.includes('videourl')"
        prop="videourl"
        min-width="120px"
        label="原始影像"
        align="center"
        show-overflow-tooltip
      >
        <template #default="{ row }">
          <span @click="originalInfo(row)" style="cursor: pointer"
            ><el-icon><Document /></el-icon
          ></span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="filtrateList.includes('checkTime')"
        min-width="160px"
        prop="checkTime1"
        label="检查时间"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('docname')"
        prop="docname"
        min-width="100px"
        label="检查医师"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('uploadTime')"
        prop="uploadTime1"
        min-width="160px"
        label="上传时间"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('analyseDoc')"
        prop="analyseDoc"
        min-width="84px"
        label="分析医师"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('reportTime')"
        prop="reportTime1"
        min-width="160px"
        label="报告时间"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('auditinsname')"
        prop="auditinsname"
        min-width="120px"
        label="审核机构名称"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('auditname')"
        prop="auditname"
        min-width="120px"
        label="审核医师"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('audittm')"
        prop="audittm"
        min-width="120px"
        label="审核时间"
        align="center"
      />
      <el-table-column
        v-if="filtrateList.includes('devid')"
        prop="devid"
        min-width="120px"
        label="设备SN"
        align="center"
      />
    </el-table>
    <el-pagination
      v-model:current-page="pageList.current"
      v-model:page-size="pageList.size"
      :page-sizes="[20, 40, 60, 80]"
      small="small"
      layout="total, sizes, prev, pager, next, jumper"
      :total="pageList.total"
      class="pagination-css"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    />
    <el-dialog
      v-model="regularVisible"
      width="800px"
      :close-on-press-escape="false"
      :close-on-click-modal="false"
    >
      <template #title>
        <span>{{ $store.getters.insname }}</span>
      </template>

      <div style="height: 620px; overflow-y: auto">
        <span style="width: 100%; text-align: center; display: inline-block"
          >超声筛查报告单</span
        >
        <el-divider style="margin: 10px 0" />
        <el-form inline>
          <el-row>
            <el-col :span="8">
              <el-form-item label="姓名：">{{ regularObj.name }}</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="性别：">{{ regularObj.sex }}</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="年龄：">{{ regularObj.age }}岁</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="申请机构：">{{
                regularObj.insname
              }}</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="患者ID：">{{
                regularObj.t_sn
              }}</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="检查部位：">{{ "心脏" }}</el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <el-divider style="margin: 10px 0" />
        <div class="box-img">
          <div>
            <el-image
              style="width: 100%; height: 100%"
              :src="regularObj.screenshot1Url"
              fit="contain"
              :preview-src-list="[regularObj.screenshot1Url]"
            />
          </div>
          <div>
            <el-image
              style="width: 100%; height: 100%"
              :src="regularObj.screenshot2Url"
              fit="contain"
              :preview-src-list="[regularObj.screenshot2Url]"
            />
          </div>
        </div>
        <div class="box-totip">
          <span>超声描述：</span>
          <div>{{ regularObj.impression }}</div>
          <span>超声提示：</span>
          <div>{{ regularObj.findings }}</div>
        </div>
        <!-- <div style="font-size: 20px; font-weight: 600">其他信息：</div> -->
        <el-form inline>
          <el-row>
            <el-col :span="8">
              <el-form-item label="报告时间：">{{
                regularObj.reportTime2
              }}</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="检查医师：">{{
                regularObj.docname
              }}</el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="报告医师：">{{
                $store.getters.name
              }}</el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </el-dialog>
    <el-dialog
      v-model="nationalVisible"
      width="800px"
      :close-on-press-escape="false"
      :close-on-click-modal="false"
    >
      <template #title>
        <span>{{ "超声心血管项目" }}</span>
      </template>
      <table border="1" style="width: 100%; border-collapse: collapse">
        <tbody>
          <tr>
            <td colspan="1">检查时间</td>
            <td colspan="2">{{ regularObj.checkTime2 }}</td>
            <td colspan="1">检查人</td>
            <td colspan="2">{{ regularObj.docname }}</td>
            <td colspan="1">检查机构名称</td>
            <td colspan="2">{{ regularObj.auditinsname }}</td>
          </tr>
          <tr style="height: 50px">
            <td colspan="9">2D及M型主要测量数据(mm)：</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">主动脉瓣环径</td>
            <td>{{ regularObj.m1 }}</td>
            <td>升主动脉径</td>
            <td>{{ regularObj.m2 }}</td>
            <td>左房前后径</td>
            <td>{{ regularObj.m3 }}</td>
            <td></td>
            <td></td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">室间隔厚度</td>
            <td>{{ regularObj.m4 }}</td>
            <td>左室舒张末径</td>
            <td>{{ regularObj.m5 }}</td>
            <td>左室后壁厚度</td>
            <td>{{ regularObj.m6 }}</td>
            <td>LVEF</td>
            <td>{{ regularObj.m7 }}</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">右室前后径</td>
            <td>{{ regularObj.m8 }}</td>
            <td>TAPSE</td>
            <td>{{ regularObj.m9 }}</td>
            <td></td>
            <td></td>
            <td>Simpson法EF</td>
            <td style="width: 120px">{{ regularObj.m10 }}</td>
          </tr>
          <tr style="height: 50px">
            <td colspan="9">瓣叶（空缺为正常）</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2"></td>
            <td>结构</td>
            <td>前向流速m/s</td>
            <td>压差mmHg</td>
            <td>返流程度</td>
            <td>返流流速m/s</td>
            <td colspan="2">压差mmHg</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">二尖瓣</td>
            <td>{{ regularObj.p1 }}</td>
            <td>{{ regularObj.p2 }}</td>
            <td>{{ regularObj.p3 }}</td>
            <td>{{ regularObj.p4 }}</td>
            <td>{{ regularObj.p5 }}</td>
            <td colspan="2">{{ regularObj.p6 }}</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">三尖瓣</td>
            <td>{{ regularObj.q1 }}</td>
            <td>{{ regularObj.q2 }}</td>
            <td>{{ regularObj.q3 }}</td>
            <td>{{ regularObj.q4 }}</td>
            <td>{{ regularObj.q5 }}</td>
            <td colspan="2">{{ regularObj.q6 }}</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">主动脉瓣</td>
            <td>{{ regularObj.r1 }}</td>
            <td>{{ regularObj.r2 }}</td>
            <td>{{ regularObj.r3 }}</td>
            <td>{{ regularObj.r4 }}</td>
            <td>{{ regularObj.r5 }}</td>
            <td colspan="2">{{ regularObj.r6 }}</td>
          </tr>
          <tr style="height: 50px" align="center">
            <td colspan="2">肺动脉瓣</td>
            <td>{{ regularObj.s1 }}</td>
            <td>{{ regularObj.s2 }}</td>
            <td>{{ regularObj.s3 }}</td>
            <td>{{ regularObj.s4 }}</td>
            <td>{{ regularObj.s5 }}</td>
            <td colspan="2">{{ regularObj.s6 }}</td>
          </tr>
        </tbody>
      </table>
    </el-dialog>
    <el-dialog
      v-model="originalVisible"
      width="1000px"
      :close-on-press-escape="false"
      :close-on-click-modal="false"
    >
      <template #title>
        <span>{{ "视频文件" }}</span>
      </template>
      <div class="box-video">
        <div
          v-for="(item, index) in originalList"
          :key="index"
          style="display: inline-block; margin-right: 10px"
        >
          <video v-if="item" controls style="width: 450px; height: 300px">
            <source :src="item" type="video/mp4" />
          </video>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getUltraCardioList } from "@/apis/reportList";
import { getSubIns, getSubInsAudit } from "@/apis/hospitalManagement";
import format from "@/utils/format";
import { ElMessage } from "element-plus";
export default {
  data() {
    let _this = this;
    return {
      hosProps: {
        lazy: true,
        checkStrictly: true,
        label: "insname",
        value: "insname",
        lazyLoad(node, resolve) {
          _this.getJunior(node, resolve);
        },
      },
      auditProps: {
        lazy: true,
        checkStrictly: true,
        label: "insname",
        value: "insname",
        lazyLoad(node, resolve) {
          _this.getAuditJunior(node, resolve);
        },
      },
      filtrateList: [
        "t_sn",
        "devid",
        "devname",
        "name",
        "sex",
        "age",
        "checkTime",
        "insname",
        "docname",
        "uploadTime",
        "analyseDoc",
        "audittm",
        "reportTime",
        "auditinsname",
        "auditname",
        "auditstatus",
        "dicomurl",
        "upstat",
        "videourl",
      ],
      formInline: {
        keyword: "",
        inspectionTime: [],
        uploadTime: [],
        reportTime: [],
        projectName: "",
        auditorName: "",
        auditorDoctor: "",
        reportStatus: "",
      },
      tableData: [],
      tableLoading: false,
      pageList: {
        current: 1,
        size: 20,
        total: 0,
      },
      statusList: [
        {
          label: "待审核",
          value: "0",
        },
        {
          label: "审核中",
          value: "1",
        },
        {
          label: "退回重审",
          value: "2",
        },
        {
          label: "已审核",
          value: "10",
        },
      ],
      regularVisible: false,
      nationalVisible: false,
      originalVisible: false,
      regularObj: {},
      originalList: [],
    };
  },
  mounted() {
    let carCardiovascularProgramInside = localStorage.getItem(
      "carCardiovascularProgramInside"
    );
    if (carCardiovascularProgramInside) {
      this.filtrateList = JSON.parse(carCardiovascularProgramInside);
    }
    this.init();
    this.saveCookie();
  },
  methods: {
    getAuditJunior(node, resolve) {
      let subins = "";
      if (node.value) {
        subins = node.value;
      }
      getSubInsAudit({
        uname: this.$store.getters.name,
        inscode: this.$store.getters.inscode,
        subins: subins,
      }).then((res) => {
        if (res.code == 0) {
          if (res.data && res.data.length > 0) {
            resolve(res.data);
          } else {
            resolve([]);
          }
        } else {
          resolve([]);
        }
      });
    },
    getJunior(node, resolve) {
      let subins = "";
      if (node.value) {
        subins = node.value;
      }
      getSubIns({
        uname: this.$store.getters.name,
        inscode: this.$store.getters.inscode,
        subins: subins,
      }).then((res) => {
        if (res.code == 0) {
          if (res.data && res.data.length > 0) {
            resolve(res.data);
          } else {
            resolve([]);
          }
        } else {
          resolve([]);
        }
      });
    },
    saveCookie() {
      let carCardiovascularProgramInside = JSON.stringify(this.filtrateList);
      localStorage.setItem(
        "carCardiovascularProgramInside",
        carCardiovascularProgramInside
      );
    },
    changeBox() {
      let carCardiovascularProgramInside = JSON.stringify(this.filtrateList);
      localStorage.setItem(
        "carCardiovascularProgramInside",
        carCardiovascularProgramInside
      );
    },
    init() {
      this.getTableData();
    },
    getTableData() {
      this.tableData = [];
      this.tableLoading = true;
      let projectName = "";
      if (
        this.formInline.projectName &&
        this.formInline.projectName.length > 0
      ) {
        projectName =
          this.formInline.projectName[this.formInline.projectName.length - 1];
      }
      let auditorName = "";
      if (
        this.formInline.auditorName &&
        this.formInline.auditorName.length > 0
      ) {
        auditorName =
          this.formInline.auditorName[this.formInline.auditorName.length - 1];
      }
      getUltraCardioList({
        page: this.pageList.current, // 当前页
        size: this.pageList.size, // 每页size
        uname: this.$store.getters.name, // 登录用户
        insname: this.$store.getters.insname, //用户机构名
        keyword: this.formInline.keyword ? this.formInline.keyword : "", // 关键字
        inspectionStime: this.formInline.inspectionTime
          ? this.formInline.inspectionTime[0]
            ? this.formInline.inspectionTime[0]
            : ""
          : "", // 检查开始时间
        inspectionEtime: this.formInline.inspectionTime
          ? this.formInline.inspectionTime[1]
            ? this.formInline.inspectionTime[1]
            : ""
          : "", // 检查结束时间
        uploadStime: this.formInline.uploadTime
          ? this.formInline.uploadTime[0]
            ? this.formInline.uploadTime[0]
            : ""
          : "", //上传开始时间
        uploadEtime: this.formInline.uploadTime
          ? this.formInline.uploadTime[1]
            ? this.formInline.uploadTime[1]
            : ""
          : "", //上传结束时间
        reportStime: this.formInline.reportTime
          ? this.formInline.reportTime[0]
            ? this.formInline.reportTime[0]
            : ""
          : "", //报告开始时间
        reportEtime: this.formInline.reportTime
          ? this.formInline.reportTime[1]
            ? this.formInline.reportTime[1]
            : ""
          : "", //报告结束时间
        projectName: projectName ? projectName : "", //项目点名称
        auditorName: auditorName ? auditorName : "", //审核机构名称
        auditorDoctor: this.formInline.auditorDoctor
          ? this.formInline.auditorDoctor
          : "", //审核医师
        reportStatus: this.formInline.reportStatus
          ? this.formInline.reportStatus
          : "", //报告状态
        project: "心血管",
      }).then((res) => {
        if (res.code == 0) {
          if (res.data && res.data.length > 0) {
            res.data.forEach((el) => {
              el.checkTime1 = format(
                el.checkTime * 1000,
                "YYYY-MM-DD HH:mm:ss"
              );
              el.uploadTime1 = format(
                el.uploadTime * 1000,
                "YYYY-MM-DD HH:mm:ss"
              );
              el.reportTime1 = format(
                el.reportTime * 1000,
                "YYYY-MM-DD HH:mm:ss"
              );
              el.checkTime2 = format(el.checkTime * 1000, "YYYY-MM-DD");
              el.ctime2 = format(el.ctime * 1000, "YYYY-MM-DD");
              el.reportTime2 = format(el.reportTime * 1000, "YYYY-MM-DD");
              el.audittm = format(el.audittm * 1000, "YYYY-MM-DD");
            });
            this.tableData = res.data;
            this.pageList.total = res.size;
          }
          this.tableLoading = false;
        }
      });
    },
    // 搜索
    search() {
      this.pageList.current = 1;
      this.getTableData();
    },
    // 重置
    reset() {
      this.formInline.keyword = "";
      this.formInline.inspectionTime = [];
      this.formInline.uploadTime = [];
      this.formInline.reportTime = [];
      this.formInline.projectName = "";
      this.formInline.auditorName = "";
      this.formInline.auditorDoctor = "";
      this.formInline.reportStatus = "";
      this.pageList.current = 1;
      this.pageList.size = 20;
      this.getTableData();
    },
    // 点击常规报告
    regularInfo(row) {
      console.log(row, "row");
      this.regularObj = {};
      this.regularObj = row;
      this.regularVisible = true;
    },
    // 点击国家报告
    nationalInfo(row) {
      console.log(row, "row");
      this.regularObj = {};
      this.regularObj = row;
      this.nationalVisible = true;
    },
    // 点击原始影像
    originalInfo(row) {
      console.log(row, "row");
      if (row.videourl && row.videourl.length > 0) {
        this.originalList = [];
        this.originalList = row.videourl;
        this.originalVisible = true;
      } else {
        ElMessage({
          message: "暂无影像",
          type: "warning",
        });
      }
    },
    handleSizeChange(val) {
      this.pageList.current = 1;
      this.pageList.size = val;
      this.getTableData();
    },
    handleCurrentChange(val) {
      this.pageList.current = val;
      this.getTableData();
    },
  },
};
</script>
